import React from 'react'
import 'amis/lib/themes/cxd.css'
import amisRender from '@/components/amis/amisRender'
import upmsRoleIdSelectUtils from '@/components/upms/upmsRoleIdSelectUtils'
import { SelectControlSchema } from 'amis/lib/renderers/Form/Select'
import upmsAppIdSelectUtils from '@/components/upms/upmsAppIdSelectUtils'
import { ApiObject } from 'amis-core/lib/types'
import { RsqlDataOperator } from '@/core/utils/rsql/types/RsqlDataOperator'
import { RsqlDataOperatorEnum } from '@/core/utils/rsql/types/RsqlOperatorEnum'
import rsqlUtils from '@/core/utils/rsql/rsqlUtils'
import coreConstants from '@/core/constants/coreConstants'
import iamAccountIdForProfileSelectUtils from '@/components/account/iamAccountIdForProfileSelectUtils'
import upmsAdminApiConfig from '@/core/upms/generated/apiconfig/upmsAdminApiConfig'
import accountAdminApiConfig from '@/core/account/generated/apiconfig/accountAdminApiConfig'

const Page = () => {
	let schema = {
		type: 'page',
		body: {
			type: 'form',
			canAccessSuperData: false,
			data: {
				roleId: 2,
			},
			body: [
				{
					...upmsAppIdSelectUtils.getSchema({ name: 'upmsAppId' }),
					required: true,
				} as SelectControlSchema,
				{
					...upmsRoleIdSelectUtils.getSchema({
						name: 'roleId',
						sourceSendOn: 'data.upmsAppId',
						sourceData: {
							id: '${roleId}',
							upmsAppId: '${upmsAppId}',
						},
						autoCompleteRequestAdaptorHandler: (
							api: ApiObject,
							context: any,
							operators: RsqlDataOperator[],
						): ApiObject | Promise<ApiObject> => {
							operators.push({
								operator: RsqlDataOperatorEnum.EQUAL,
								propertyName: 'upmsAppId',
							} as RsqlDataOperator)
							api = rsqlUtils.addRsqlFilter(api, context, coreConstants.api.queryFilterName, operators)
							return api
						},
					}),
					disabledOn: '!data.upmsAppId',
					required: true,
				} as SelectControlSchema,
				{
					...iamAccountIdForProfileSelectUtils.getSchema({
						name: 'accountId',
					}),
					disabledOn: '!data.upmsAppId',
					required: true,
				} as SelectControlSchema,
			],
		},
	}
	schema = {
		type: 'page',
		title: '表单选线之间的远程联动',
		body: {
			type: 'form',
			mode: 'horizontal',
			title: '',
			actions: [],
			body: [
				'<p class="text-danger">表单选项可以设置 source 通过 API 远程拉取，11同时如果 source 中有变量的话，变量值发生变化就会重新拉取，达到联动效果。</p>',
				{
					type: 'divider',
				},
				{
					label: '选项1',
					type: 'select',
					labelClassName: 'text-muted',
					name: 'a',
					inline: true,
					options: [
						{
							label: '选项1',
							value: 1,
						},
						{
							label: '选项2',
							value: 2,
						},
						{
							label: '选项3',
							value: 3,
						},
					],
				},
				{
					label: '选项2',
					type: 'select',
					labelClassName: 'text-muted',
					name: 'b',
					inline: true,
					source: {
						//url: upmsAdminApiConfig.upmsRole.list.mockUri + '?___a=${a}',
						url: upmsAdminApiConfig.upmsRole.list.mockUri,
						method: upmsAdminApiConfig.upmsRole.list.method,
						data: {
							b: '${a}',
						},
						sendOn: 'true',
					},
					//initFetchOn: 'data.a',
				},
				{
					label: '选项3',
					type: 'select',
					labelClassName: 'text-muted',
					name: 'c',
					inline: true,
					visibleOn: 'data.b',
					source: accountAdminApiConfig.iamAccount.list.mockUri,
				},
			],
		},
	} as any
	return <>{amisRender.render(schema)}</>
}
export default Page
